import React, {Component} from 'react';
import Children from './Children';

export default class Parent extends Component {
	/* 
	   此方法只能捕捉子组件同时在生命周期中的错误
	*/

	state = {hasError: false};

	// 生命周期函数，一旦后台组件报错，就会触发
	static getDerivedStateFromError(error) {
		console.log(error);
		// 在render之前触发
		// 返回新的state
		return {
			hasError: true,
		};
	}

	componentDidCatch(error, info) {
		// 统计页面的错误。发送请求发送到后台去
		console.log(error, info);
	}

	render() {
		return (
			<div>
				<h1 style={{color: 'red'}}>
					{this.state.hasError ? (
						'当前服务存在错误请联系开发人员改正'
					) : (
						<Children></Children>
					)}
				</h1>
			</div>
		);
	}
}
